// pages/category/index.js
import { request } from "../../request/index.js";

Page({
  /**
   * 页面的初始数据
   */
  data: {
     //左侧菜单数据
     leftMenuList:[],
     //右侧商品
     rightContent:[],
     //被点击左侧的索引值
     currentIndex:0,
     scrolltop:0,
  },
  //接口返回数据
  cates:[],

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 判断是否有旧数据 {time:Date.now(),data[]} 有就使用 没有就发请求
    //使用本地存储wx.getStorageSync("key","value")
    const Cates=wx.getStorageSync("cates")
    if(!Cates){
      this.getCates();    
    }else{
      //有旧数据     定义过期时间  
      if(Date.now()-Cates.time>1000*100){
        this.getCates();    
      }else{
         //使用旧数据
         this.cates=cates.data;
         let leftMenuList=this.cates.map(v=>v.cat_name);
         let rightContent=this.cates[0].children;
         this.setData({
          leftMenuList,rightContent
        })
      }
    }
  },
  //获取分类的数据
  getCates(){
    request({url:"/categories"})
    .then(res=>{
        this.cates=res.data.message;
        //接口数据存到本地
        wx.getStorageSync("cates",{time:Date.now(),data:this.cates})
        //构造左侧大菜单数据
        let leftMenuList=this.cates.map(v=>v.cat_name);
        //构造右侧的商品数据
        let rightContent=this.cates[0].children;

        this.setData({
          leftMenuList,rightContent
        })
    })
  },
  //点击字体换色
  handleItem(e){
    //获取索引   给currentIndex赋值   根据不同的索引来渲染右侧的商品
     const {index}=e.currentTarget.dataset;
     let rightContent=this.cates[index].children;
     this.setData({
       currentIndex:index,
       rightContent,
       //重新设置右侧内容的scrolltop
       scrolltop:0,
     })
  }


})